<!doctype html>
<html class="no-js">

<head>
    <title>评价</title>
    <#include "/fd/components/meta.html" />
    <#include "/fd/components/stylesheets.html" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/rateYo/2.3.2/jquery.rateyo.min.css">
    <link rel="stylesheet" type="text/css" href="/fd/stylesheets/commentOrder.css">
</head>

<body>
    <div id="app">
        <#if record.content??>
            <div class="info">
                <div class="info-content">${(record.content)!}</div>
                <div class="info-time">${(record.addTime)!}</div>
            </div>
        </#if>
        <#if record.answerContent??>
            <div class="info">
                <div class="info-content">${(record.answerContent)!}</div>
                <div class="info-time">${(record.answerAddTime)!}</div>
            </div>
        </#if>
        <#if record.consultContent??>
            <div class="info">
                <div class="info-content">${(record.consultContent)!}</div>
                <div class="info-time">${(record.consultAddTime)!}</div>
            </div>
        </#if>
        <div class="rate">
            <div class="rate-row">
                <div>咨询质量</div>
                <div id="rate1"></div>
            </div>
            <div class="rate-row">
                <div>服务态度</div>
                <div id="rate2"></div>
            </div>
            <div class="rate-row">
                <div>回复速度</div>
                <div id="rate3"></div>
            </div>
        </div>
        <div class="comment">
            <textarea placeholder="请输入" v-model="message" rows="5"></textarea>
        </div>
        <div class="submit">
            <button class="am-btn am-btn-default" @click='send'>提交</button>
        </div>
        <#include "/fd/components/footer.html" />
    </div>
    <#include "/fd/components/scripts.html" />
    <#include "/fd/components/http.html" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/rateYo/2.3.2/jquery.rateyo.min.js"></script>
    <script type="text/javascript">
    var app = new Vue({
        el: '#app',
        data: {
            questionId: '${record.questionId!}',
            consultId: '${record.consultId!}',
            orderNo: '${record.orderNo!}',
            message: '',
            quality: 0,
            attitude: 0,
            replySpeed: 0
        },
        methods: {
            send: function() {
                this.quality = $("#rate1").rateYo("rating");
                this.attitude = $("#rate2").rateYo("rating");
                this.replySpeed = $("#rate3").rateYo("rating");
                var param = {
                    questionId: this.questionId,
                    consultId: this.consultId,
                    orderNo: this.orderNo,
                    content: this.message,
                    quality: this.quality,
                    attitude: this.attitude,
                    replySpeed: this.replySpeed
                }
                this.message = "";

                var success = function(data) {
                    window.location.href = '/fd/userInfo'
                    return;
                }
                var fail = function() {}
                request('/fd/fakeCommentOrder', param, success, fail)
            }
        }
    })
    </script>
    <script>
    $(function() {
        $("#rate1").rateYo({
            fullStar: true,
            multiColor: true
        });
        $("#rate2").rateYo({
            fullStar: true,
            multiColor: true
        });
        $("#rate3").rateYo({
            fullStar: true,
            multiColor: true
        });
    });
    </script>
</body>

</html>